@charset 'utf-8';

header{
    display: flex;
    height: 70px;
    .top_logo{
        img{
            vertical-align: initial;
        }
        width: 251px;
        height: 70px;
        background: #008b98;
        line-height: 70px;
        padding-left: 12px;
        span{
            display: inline-block;
            font-size: 12px;
            color: white;
            padding-top: 18px;
            letter-spacing: 4px;
        }
    }
    .top_list{
        width: 100%;
        flex: 1;
        display: flex;
        line-height: 70px;
        box-shadow:0px 1px 4px #333333;
        margin-bottom:initial;
        li{
            overflow:hidden; 
            &:not(:last-child){
            flex: 1;
            text-align: center;
           }
            &:last-child{
                line-height: 70px;
                padding-right: 15px;
                img{
                   vertical-align: middle;
                }
            }
            .active{
                color: #008b98;
            }
            a{
                color: black;
                font-size: 14px;
                &:hover{
                   color: #008b98;
                }
            }
        }
    }
}
.con_left{
    position: absolute;
    left: 0;
    top: 0;
    width: 247px;
    .l-box{
        &:hover{
            cursor: pointer;
            background: #333;
        }
    }
    .in{
        border-right: 4px solid #00828e;
        width: 251px;
        background: #333;
    }
    div{
        width: 100%;
        text-align: center;
        height: 545px;
        line-height: 545px;
        background: #434343;
        font-size: 14px;
        color:#fff; 
//                  &:hover{
//                      background: #434343;
//                  }
    }
}
